<template>
    <div class="wl-main">
        <div>
            <img src="../../assets/img/国庆/active_1.jpg" alt=""/></a>
        </div>
        <div>
            <a href="https://shop.sofoshare.com/index/web/getCoupon?coupon_id=7FRCwdnZz4O4MdlH37fIVg=="><img src="../../assets/img/国庆/active_2.jpg"
                                                                                    alt=""/></a>
        </div>
      <div>
        <a href="https://shop.sofoshare.com/index/web/getCoupon?coupon_id=UNYZa2tlIbaJSTbmtSsp0Q=="><img src="../../assets/img/国庆/active_3.jpg" alt=""/></a>
      </div>
      <div>
        <a href="https://shop.sofoshare.com/index/web/getCoupon?coupon_id=DBtyTaC5lzNi26OpT8KRQQ=="><img src="../../assets/img/国庆/active_4.jpg" alt=""/></a>
      </div>
      <div>
        <a href="https://shop.sofoshare.com/index/web/productDetail?id=20&incoming=1"><img src="../../assets/img/国庆/active_5.jpg" alt=""/></a>
      </div>
      <div>
        <a href="https://shop.sofoshare.com/index/web/productDetail?id=57&incoming=1"><img src="../../assets/img/国庆/active_6.jpg" alt=""/></a>
      </div>
      <div>
        <a href="https://shop.sofoshare.com/index/web/productDetail?id=12&incoming=1"><img src="../../assets/img/国庆/active_7.jpg" alt=""/></a>
      </div>
      <div>
        <a href="https://shop.sofoshare.com/index/web/productDetail?id=36&incoming=1"><img src="../../assets/img/国庆/active_8.jpg" alt=""/></a>
      </div>
      <div>
        <a href="https://shop.sofoshare.com/index/web/productDetail?id=15&incoming=1"><img src="../../assets/img/国庆/active_9.jpg" alt=""/></a>
      </div>
      <div class="wls-box">
        <img src="../../assets/img/国庆/active_10.jpg" alt=""/>
        <div>
          <a href="https://shop.sofoshare.com/index/web/productDetail?id=31&incoming=1" class="fl"></a>
          <a href="https://shop.sofoshare.com/index/web/productDetail?id=33&incoming=1" class="fl"></a>
          <a href="https://shop.sofoshare.com/index/web/productDetail?id=39&incoming=1" class="fl"></a>
          <a href="https://shop.sofoshare.com/index/web/productDetail?id=46&incoming=1" class="fl"></a>
        </div>
      </div>

        <!--<div class="wls-box">-->
            <!--<img src="https://f10.baidu.com/it/u=2987595138,4271236850&fm=72" alt="../../assets/img/7_06.jpg"/>-->
            <!--<div>-->
                <!--<a href="https://shop.sofoshare.com/index/web/productDetail?id=33" class="fl"></a>-->
                <!--<a href="https://shop.sofoshare.com/index/web/productDetail?id=15" class="fl"></a>-->
                <!--<a href="https://shop.sofoshare.com/index/web/productDetail?id=11" class="fl"></a>-->
                <!--<a href="https://shop.sofoshare.com/index/web/productDetail?id=31" class="fl"></a>-->
            <!--</div>-->
        <BtnToTop></BtnToTop>
        <BtnToIndex></BtnToIndex>
    </div>
</template>

<script type="text/ecmascript-6">
    import BtnToTop from '../../components/BtnToTop.vue'
    import BtnToIndex from '../../components/BtnToIndex.vue'

    import { insertPvUv } from '../../assets/js/utils'
    export default {
        components: {
            BtnToTop, BtnToIndex
        },
        created() {
            insertPvUv(localStorage.getItem('href'),3)
        },
    }
</script>

<style scoped>
    .wl-main {
        font-size: 0px;
    }

    .wl-box, .wls-box {
        position: relative;
    }

    .wl-box > div {
        position: absolute;
        bottom: 6%;
        width: 100%;
        height: 14%;
    }

    .wls-box > div {
        position: absolute;
        bottom: 46%;
        width: 100%;
        height: 40%;
        /*padding: 0px 5%;*/
        box-sizing: border-box;
    }

    .wl-box > div > a {
        width: 40%;
        height: 100%;
        padding: 0px 5%;
    }

    .wls-box > div > a {
        width: 50%;
        height: 98%;
        margin-bottom: 3%
    }

    .fl {
        float: left;
    }

    /* .color-red{background-color:red; width:50%; height:100%;}
    .color-blue{background-color:blue; width:50%; height:100%;} */
    .fr {
        float: right;
    }

    a {
        display: inline-block;
        text-decoration: none;
        width: 100%;
        padding: 0px;
        margin: 0px;
    }

    img {
        width: 100%;
        margin: 0px;
        border: 0px;
        vertical-align: bottom;
    }
</style>
